<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>表格</title>
    </head>
    <body>

       <table border="1" cellspacing="5" align="center" width="600px">

           <!-- caption 指定表格的标题 -->
           <caption>无忌一家</caption>

           <!-- table header 表格头 -->
           <thead>
                <tr>
                    <!-- table header cell 表格头上的单元格-->
                    <th width="20%">姓名</th>
                    <th width="10%">性别</th>
                    <th width="10%">年龄</th>
                    <th width="50%">地址</th>
                </tr>
           </thead>

           <!-- table body 表格体 -->
           <tbody>

                <tr>
                    <td>张三丰</td>
                    <td>男</td>
                    <td>100</td>
                    <td>武当山</td>
                </tr>

                <tr>
                    <td>张翠山</td>
                    <td>男</td>
                    <td>29</td>
                    <td>武当山</td>
                </tr>

                <tr>
                    <td>殷素素</td>
                    <td>女</td>
                    <td>25</td>
                    <td>什么山</td>
                </tr>

                <tr>
                    <td>张无忌</td>
                    <td>男</td>
                    <td>7</td>
                    <td>冰火岛</td>
                </tr>

           </tbody>

           <!-- table footer 表格脚 -->
           <tfoot>
               <tr>
                   <!-- table header cell 表格头上的单元格-->
                   <td width="20%" align="center">姓名</td>
                   <td width="10%" align="center">性别</td>
                   <td width="10%" align="center">年龄</td>
                   <td width="50%" align="center">地址</td>
               </tr>
           </tfoot>
       </table>

        <ul>
            <li>th 标签的 align 属性用于控制单元格中内容的水平排列方式 ( left | center | right )</li>
            <li>td 标签的 align 属性用于控制单元格中内容的水平排列方式 ( left | center | right )</li>
        </ul>

    </body>
</html>